<!-- 需求详情 -->
<template>
	<view class="page" v-show="isLoaded">
		<!-- 需求信息 -->
		<NeedsInfo :detail="detail"></NeedsInfo>
		<!-- 上传照片 -->
		<UploadPic :detail="detail"></UploadPic>
		<!-- 作业地址 -->
		<WorkAddress :detail="detail"></WorkAddress>
		<!-- 按钮 -->
		<BottomOperation :detail="detail"></BottomOperation>
	</view>
</template>

<script setup>
	import api from '@/api/index.js';
	import { ref } from 'vue';
	import { onLoad } from "@dcloudio/uni-app";
	import NeedsInfo from './components/needs-info.vue';
	import UploadPic from './components/upload-pic.vue';
	import WorkAddress from './components/work-address.vue';
	import BottomOperation from './components/bottom-operation.vue';

	const isLoaded = ref(false); // 是否加载完
	const detail = ref({});

	onLoad((options) => {
		if (!options.id) return uni.showNoneToast('缺少参数');
		getDetail(options.id);
	});

	// 获取详情
	const getDetail = async (id) => {
		uni.showLoading({ title: '加载中...' });
		const res = await api.c_need_api.info({ id }).finally(() => setTimeout(uni.hideLoading, 100));
		isLoaded.value = true;
		detail.value = res.data.data;
	}
</script>

<style lang="scss" scoped>

</style>